<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      xmlns:c="http://java.sun.com/jsp/jstl/core">
  <h:body>
    <ui:composition template="/template/base.xhtml">
      <ui:define name="content">
        <h:form id="venta-form">
          <p:growl id="growl" showDetail="true" sticky="true" />
          <p:spacer />

          <p:panel header='Ventas de Articulos' >

            <p:panelGrid columns="1" style="text-align:left; float:inside">  
              <p:panelGrid columns="7"> 
                <p:outputLabel value="Persona" for="persona" />
                <p:autoComplete id="persona" value="#{ventaBean.personaSelected}" 
                                completeMethod="#{ventaBean.completeText}"
                                converter="personaConverter"/>

                <p:outputLabel value="Articulo" for="articulo" />
                <p:selectOneMenu id="articulo"
                                 value="#{ventaBean.articuloSelected}"
                                 converter="articuloConverter">
                  <c:forEach var="articulo"
                             items="#{articuloBean.articulos}">
                    <f:selectItem itemValue="#{articulo}"
                                  itemLabel="#{articulo.descripcion}" />
                  </c:forEach>
                </p:selectOneMenu>

                <p:outputLabel value="Cantidad" for="cantidad" />
                <p:inputText id="cantidad" value="#{ventaBean.cantidadSelected}" />

                <p:commandButton process="venta-form" value="Agregar" 
                                 action="#{ventaBean.addArticulos}"
                                 style="text-align:right; float:right" 
                                 onclick="" oncomplete=""
                                 update=":venta-form:dtVentas">
                </p:commandButton>

              </p:panelGrid>

              <p:panel>
                <p:dataTable id="dtVentas" var="detalle" value="#{ventaBean.venta.ventaDetalles}"
                             rows="10" paginator="false" paginatorPosition="bottom"                    
                             selection="#{ventaBean.ventaSelected}" rowKey="#{detalle.articulo.id}"
                             selectionMode="single">

                  <p:ajax event="rowSelect" listener="#{ventaBean.onRowSelect}" />

                  <p:column  headerText="Articulo">
                    <h:outputText value="#{detalle.articulo.descripcion}" />
                  </p:column>

                  <p:column  headerText="Cantidad">
                    <h:outputText value="#{detalle.cantidad}" />
                  </p:column>

                  <p:column  headerText="Precio">
                    <h:outputText value="#{detalle.articulo.precioVenta}" />
                  </p:column>

                  <p:column headerText="Total">
                    <h:outputText value="#{detalle.totalVenta}" />
                  </p:column>

                  <f:facet name="footer" >
                    <p:outputLabel value="Importe Total Gs: #{ventaBean.totalAPagar}"  />
                  </f:facet>
                </p:dataTable>
              </p:panel>


              <p:panelGrid columns="7"  style="text-align:left; float:inside">

                <p:outputLabel value="Monto A Pagar" for="monto" />
                <p:inputText id="monto" value="#{ventaBean.montoPagar}" />

                <p:outputLabel value="Tipo de Pago" for="tipoPago" />
                <p:selectOneMenu id="tipoPago"
                                 value="#{ventaBean.tipoPagoSelected}"
                                 converter="tipoPagoConverter">
                  <c:forEach var="tipoPago"
                             items="#{ventaBean.tiposPagos}">
                    <f:selectItem itemValue="#{tipoPago}"
                                  itemLabel="#{tipoPago}" />
                  </c:forEach>
                </p:selectOneMenu>

                <p:outputLabel value="Observacion" for="observacion" />
                <p:inputText id="observacion" value="#{ventaBean.observacion}" />

                <p:commandButton process="venta-form" value="Cobrar" 
                                 action="#{ventaBean.cobrar}"
                                 style="text-align:right; float:right" 
                                 onclick="" oncomplete=""
                                 update=":venta-form:dtVentas">
                </p:commandButton>
              </p:panelGrid>
            </p:panelGrid>
          </p:panel>
          <f:facet name="footer">
          </f:facet>
        </h:form>
      </ui:define>
    </ui:composition>
  </h:body>
</html>
